<nz-breadcrumb style="margin:12px 0;">
    <nz-breadcrumb-item>系统设置</nz-breadcrumb-item>
    <nz-breadcrumb-item>学校管理</nz-breadcrumb-item>
</nz-breadcrumb>
<div style="padding:24px; background: #fff; min-height: 100%;">
    <button nz-button [nzType]="'primary'" [nzShape]="'circle'" (click)="showModal()">
        <i class="anticon anticon-plus"></i>
    </button>
    <nz-modal [nzVisible]="isVisible" [nzTitle]="modalTitle" [nzContent]="modalContent" [nzFooter]="modalFooter" (nzOnCancel)="handleCancel($event)">
        <ng-template #modalTitle>
            <i class="anticon anticon-edit"></i> {{ isViewStateUpdate ? '更新学校' : '新增学校' }}
        </ng-template>
        <ng-template #modalContent>
            <form nz-form [formGroup]="schoolForm" (ngSubmit)="submitForm()" [nzType]="'horizontal'">
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>学校名称</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16" [nzValidateStatus]="getFormControl('schoolName')" [nzHasFeedback]="true">
                        <nz-input formControlName="schoolName" [nzPlaceHolder]="'学校名称'" [nzSize]="'large'"></nz-input>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>管理员账户</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16" [nzValidateStatus]="getFormControl('username')" [nzHasFeedback]="true">
                        <nz-input formControlName="username" [nzPlaceHolder]="'管理员账户(最少6个字符)'" [nzSize]="'large'" [nzDisabled]="isViewStateUpdate"></nz-input>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>学校负责人</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16" [nzValidateStatus]="getFormControl('schoolmaster')" [nzHasFeedback]="true">
                        <nz-input formControlName="schoolmaster" [nzPlaceHolder]="'学校负责人'" [nzSize]="'large'"></nz-input>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>省市区</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16">
                        <nz-cascader
                            [class.class123]="true"
                            formControlName="province"
                            [nzOptions]="provinces"
                            [nzValueProperty]="'value'"
                            [nzLabelProperty]="'label'"
                            [nzPlaceHolder]="'请选择省市区'">
                        </nz-cascader>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>地址</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16" [nzValidateStatus]="getFormControl('address')" [nzHasFeedback]="true">
                        <nz-input formControlName="address" [nzPlaceHolder]="'地址'" [nzSize]="'large'"></nz-input>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>介绍</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16">
                        <nz-input formControlName="introduction" [nzType]="'textarea'" [nzRows]="'4'" [nzPlaceHolder]="'介绍'"></nz-input>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>教师数量</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16">
                        <nz-input formControlName="teacherCount" [nzPlaceHolder]="'教师数量'" [nzSize]="'large'" [nzType]="'number'"></nz-input>
                    </div>
                </div>
                <div nz-form-item nz-row>
                    <div nz-form-label nz-col [nzSpan]="6">
                        <label>学生数量</label>
                    </div>
                    <div nz-form-control nz-col [nzSpan]="16">
                        <nz-input formControlName="studentCount" [nzPlaceHolder]="'学生数量'" [nzSize]="'large'" [nzType]="'number'"></nz-input>
                    </div>
                </div>
            </form>
        </ng-template>
        <ng-template #modalFooter>
            <button nz-button [nzType]="'default'" [nzSize]="'large'" (click)="handleCancel($event)">返 回</button>
            <button nz-button [nzType]="'primary'" [nzSize]="'large'" (click)="handleOk($event, schoolForm.value)" [nzLoading]="isConfirmLoading"
                [disabled]="!schoolForm.valid">{{ isViewStateUpdate ? '更 新' : '提 交' }}</button>
        </ng-template>
    </nz-modal>
    <nz-table #nzTable [nzAjaxData]="schoolList" [nzShowSizeChanger]="true" [nzLoading]="_loading" [nzTotal]="_total" [(nzPageIndex)]="_current"
        (nzPageIndexChange)="getAllSchools()" [(nzPageSize)]="_pageSize" (nzPageSizeChange)="getAllSchools()">
        <thead nz-thead>
            <tr>
                <th></th>
                <th nz-th>
                    <span>学校名称</span>
                </th>
                <th nz-th>
                    <span>负责人</span>
                </th>
                <th nz-th>
                    <span>管理员账号</span>
                </th>
                <th nz-th>
                    <span>所在地区</span>
                </th>
                <th nz-th>
                    <span>学校地址</span>
                </th>
                <th nz-th>
                    <span>学校介绍</span>
                </th>
                <th nz-th>
                    <span>教师数量</span>
                </th>
                <th nz-th>
                    <span>学生数量</span>
                </th>
                <th nz-th>
                    <span>状态</span>
                </th>
                <th nz-th>
                    <span>创建日期</span>
                </th>
                <th nz-th>
                    <span>操作</span>
                </th>
            </tr>
        </thead>
        <tbody nz-tbody>
            <tr nz-tbody-tr *ngFor="let school of nzTable.data; let i = index;">
                <td nz-td>{{ i + 1 }}</td>
                <td nz-td>{{ school.schoolName }}</td>
                <td nz-td>{{ school.schoolmaster }}</td>
                <td nz-td>{{ school.username }}</td>
                <td nz-td>{{ school.province + ' ' + school.city + ' ' + school.area }}</td>
                <td nz-td>{{ school.address }}</td>
                <td nz-td>{{ school.introduction.substr(0, 10) + '...' }}</td>
                <td nz-td>{{ school.count.teacher }}</td>
                <td nz-td>{{ school.count.student }}</td>
                <td nz-td>
                    <nz-tag [nzColor]="'green'" *ngIf="school.status === 1">正常</nz-tag>
                    <nz-tag [nzColor]="'red'" *ngIf="school.status === 2">禁用</nz-tag>
                </td>
                <td nz-td>{{ school.createDate | date: 'yyyy-MM-dd HH:mm:ss' }}</td>
                <td nz-td>
                    <button nz-button class="ant-btn" [nzType]="'primary'" (click)="showModal(school._id)">
                        <i class="anticon anticon-edit"></i>
                    </button>
                    <nz-popconfirm [nzTitle]="'确定要禁用学校吗？'" (nzOnConfirm)="disable(school._id, 2)" [nzPlacement]="'topRight'" *ngIf="school.status === 1">
                        <button nz-popconfirm nz-button class="ant-btn" [nzType]="'danger'">
                            <i class="anticon anticon-close-square"></i>
                        </button>
                    </nz-popconfirm>
                    <nz-popconfirm [nzTitle]="'确定要启用学校吗？'" (nzOnConfirm)="disable(school._id, 1)" [nzPlacement]="'topRight'" *ngIf="school.status === 2">
                        <button nz-popconfirm nz-button class="ant-btn" [nzType]="'danger'">
                            <i class="anticon anticon-check"></i>
                        </button>
                    </nz-popconfirm>
                    <nz-popconfirm [nzTitle]="'确定要删除学校吗？'" (nzOnConfirm)="del(school._id)" [nzPlacement]="'topRight'">
                        <button nz-popconfirm nz-button class="ant-btn" [nzType]="'danger'">
                            <i class="anticon anticon-delete"></i>
                        </button>
                    </nz-popconfirm>
                </td>
            </tr>
        </tbody>
    </nz-table>
</div>